<template>
  <u-radio-group v-model="radiovalue1" placement="column" @change="groupChange">
    <u-radio
      :customStyle="{ marginBottom: '8px' }"
      v-for="(item, index) in radiolist1"
      :key="index"
      :label="item.name"
      :name="item.name"
      @change="radioChange"
    >
    </u-radio>
  </u-radio-group>
</template>

<script>
export default {
  data() {
    return {
      // 基本案列数据
      radiolist1: [
        {
          name: "苹果",
          disabled: false,
        },
        {
          name: "香蕉",
          disabled: false,
        },
        {
          name: "橙子",
          disabled: false,
        },
        {
          name: "榴莲",
          disabled: false,
        },
      ],
      // u-radio-group的v-model绑定的值如果设置为某个radio的name，就会被默认选中
      radiovalue1: "苹果",
    };
  },
  methods: {
    groupChange(n) {
      console.log("groupChange", n);
    },
    radioChange(n) {
      console.log("radioChange", n);
    },
  },
};
</script>
